<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>影厅座位维护</title>
    <jsp:include page="/IncludeJS.jsp"></jsp:include>
</head>
<body onload="init();">
<script type="text/javascript">
    function check() {
        if ($("#hallName").val() == "") {
            alert("请输入影厅座位名称");
            $('#hallName').focus();
            return false;
        }
        if ($("#row").val() == "") {
            alert("请输入总排数");
            $('#row').focus();
            return false;
        }
        if (isNaN($("#row").val())) {
            alert("总排数只能输入数字字符");
            $('#row').focus();
            return false;
        }
        if ($("#col").val() == "") {
            alert("请输入座位数/排");
            $('#col').focus();
            return false;
        }
        if (isNaN($("#col").val())) {
            alert("座位数只能输入数字字符");
            $('#col').focus();
            return false;
        }
        if ($("#id").val() == "") {
            $("#id").val(0);
        }
        return true;
    }

    function init() {
        var key = $("#id").val();

    }

    function back() {
        location.href = "${pageContext.request.contextPath }/movieHall/list";
    }

    if ("${msg}" != null && "${msg}".length > 0) {
        alert("${msg}");
    }
    var oldid = 0;

    function hallSeat(id) {
        $("#" + oldid).attr("bgcolor", "white");
        $("#" + id).attr("bgcolor", "pink");
        oldid = id;
    }

    function state(flag) {
        var url = '${pageContext.request.contextPath }/movieHall/state';
        $.post(
            url,
            {
                "hallSeatId": oldid,
                "hallId": $("#hallId").val(),
                "state": flag
            },
            function (data) {
                if (data.code == 1) {
                    $("#" + oldid).attr("bgcolor", "white");
                } else {
                    $("#" + oldid).attr("bgcolor", "red");
                }
                oldid = 0;
            },
            "json"
        );
    }
</script>
<table class="tablelist2">
    <tbody>
    <tr>
        <td class="tableselect2" style="border-bottom:none;">
            <div class="tools">
                <ul class="toolbar">
                    <li><a href="javascript:void(0);" onclick="state(1);"><span><img
                            src="${pageContext.request.contextPath }/images/buy.png"></span>启用座位</a></li>
                    <li><a href="javascript:void(0);" onclick="state(2);"><span><img
                            src="${pageContext.request.contextPath }/images/buy.png"></span>禁用座位</a></li>
                    <li class="click"><a href="javascript:void(0);" onclick="back();"><i></i>返回</a></li>
                </ul>
            </div>
        </td>
    </tr>
    </tbody>
</table>
<h2 align="center">${hall.hallName}座位表</h2>
<input type="hidden" name="hallId" id="hallId" value="${hall.hallId}">
<table align="center" width="98%" border="1">
    <c:forEach items="${seatList}" var="v" varStatus="st">
        <c:if test="${st.index==0 || st.index % hall.col==0}">
            <tr>
        </c:if>
        <c:if test="${v.state==1}">
            <td id="${v.hallSeatId}" onclick="hallSeat(${v.hallSeatId})" bgcolor="white">${v.seatName}</td>
        </c:if>
        <c:if test="${v.state==2}">
            <td id="${v.hallSeatId}" onclick="hallSeat(${v.hallSeatId})" bgcolor="red">${v.seatName}</td>
        </c:if>
        <c:if test="${(st.index+1) % hall.col==0}">
            </tr>
        </c:if>
    </c:forEach>
</table>
</body>
</html>